import React, { Component } from "react";
import { normalizedData } from "./normailzeDemo";

class ListDetail extends Component {
  componentDidMount() {
    //可以模拟请求任务详情或者直接拿数据
    console.log("这个是列表id", this.props.match.params);
  }

  render() {
    const {
      entities: { articles, users, comments },
      result
    } = normalizedData;
    const { id } = this.props.match.params;
    const content = articles[id].content;
    const author = users[articles[id].author].name;
    const commentList = articles[id].comments;
    return (
      <div>
        <h2>帖子作者:{author}</h2>
        <h3>帖子内容:{content}</h3>
        <h4>------以下评论区:-------</h4>
        <ul>
          {commentList.map(item => {
            return (
              <li>
                <h5>作者:{users[comments[item].commenter].name}</h5>
                <h5>内容:{comments[item].content}</h5>
              </li>
            );
          })}
        </ul>
      </div>
    );
  }
}

export default ListDetail;
